<template>
  <div class="app-container">
        <el-radio-group v-model="checkedRole" @change="handleCheckedRoleChange">
            <el-radio v-for="city in cities" :label="city.id" :key="city.id">{{city.roleName}}</el-radio>
        </el-radio-group>
    <br>
    <el-button :disabled="saveBtnDisabled" type="primary" @click="update">保存</el-button>
  </div>
</template>

<script>
import userApi from '@/api/acl/user'
export default {
  data() {
      return {
        checkAll: false,
        checkedRole: '', //已选中
        cities: [], //所有的
        isIndeterminate: true,
        userId:'',
        saveBtnDisabled: false, // 保存按钮是否禁用,
      };
    },
    created () {
      this.init()
    },
    methods: {
      init(){
          if (this.$route.params && this.$route.params.id) {
                this.userId = this.$route.params.id
                this.getById(this.userId)
            }
      },
      getById(userId){
          userApi.getAssign(userId).then(response => {
              var jsonObj = response.data.assignRoles
              this.checkedRole = this.getJsonToList(jsonObj,"id")
              this.cities = response.data.allRolesList
          })
      },
      //把json数据转成string再转成对象，根据Key获取value数据
      getJsonToList(json,key){
          //把JSON字符串转成对象
          var list = JSON.parse(JSON.stringify(json));
          //var list = JSON.parse(json)
          var strText = []
          //遍历这个集合对象，获取key的值
          for(var i = 0; i < list.length; i++){
             strText.push(list[i][key])
          }
          return strText[0];
      },
      handleCheckAllChange(val) {
        this.checkedRole = val ? this.cities : [];
        this.isIndeterminate = false;
      },
      handleCheckedRoleChange(value) {
        let checkedCount       = value.length;
        this.checkAll          = checkedCount === this.cities.length;
        this.isIndeterminate   = checkedCount > 0 && checkedCount < this.cities.length;
      },
      update(){
        this.saveBtnDisabled = true // 防止表单重复提交
        var ids = this.checkedRole
        console.log(ids)
        //修改权限
        userApi.saveAssign(this.userId, ids).then(response => {
            if(response.success){
              this.$message({
                type:'success',
                message:'保存成功'
              })
              this.$router.push({ path: '/authority/user/list' })
            }
        }).catch(err=>{
          // console.log(err);
          this.$message({
            type:'error',
            message:'请选择角色'
          })
          this.saveBtnDisabled = false
        })
      }
    }
};
</script>
